<template>
  <div>
    <!--页头-->
    <el-breadcrumb separator-class="el-icon-arrow-right" >
      <el-breadcrumb-item >首页</el-breadcrumb-item>
      <el-breadcrumb-item >附近商家</el-breadcrumb-item>
    </el-breadcrumb>
    <restaurant-card
        @handleCurrentChange="handleCurrentChange"
        @handleSizeChange="handleSizeChange"
        :restaurant="restaurant"></restaurant-card>
  </div>
</template>

<script>
import RestaurantCard from '../../components/restaurant/RestaurantCard'

export default {
  components: {
    RestaurantCard,
  },
  data() {
    return {
      currentDate: new Date(),

      restaurant: {
        restaurantList: [],
        queryInfo: {
          query: '',
          pagenum: 1,
          pagesize: 4
        },
        total: 0,
      }
    };
  },
  created() {
   this.getRestaurantList();

  },
  methods: {
    getRestaurantList(){
      this.$axios({
        method: "get",
        url: "/rest/list",
        params:{
          query:this.restaurant.queryInfo.query,
          pagenum:this.restaurant.queryInfo.pagenum,
          pagesize:this.restaurant.queryInfo.pagesize,
        }
      }).then(response => {
        if (response.data.success) {
          this.restaurant.restaurantList = response.data.rest_list;
          this.restaurant.total= response.data.total;
        }else {
          this.restaurant.restaurantList =[];
          this.restaurant.total= 0;
        }
      }).catch(error => console.log(error));
    },
    handleSizeChange (data) {
      this.restaurant.queryInfo=data;
      this.getRestaurantList()
    },
    //监听 页码值 改变事件
    handleCurrentChange (data) {
      this.restaurant.queryInfo=data;
      this.getRestaurantList()
    },
    toRestaurantInfo: function (restId) {

      this.$router.push({name: 'restaurantInfo', params: {shopId: restId}});

    }
  }
}
</script>

<style scoped>
</style>


